<template>
    <div class="index">
        <div class="bread-crumb">
            首页
        </div>  

        <div class="userinfo">
            <table>
                <tbody>
                    <tr>
                        <td>username</td>
                        <td>{{user.username}}</td>
                    </tr>
                     <tr>
                        <td>realName</td>
                        <td>{{user.realName}}</td>
                    </tr>
                     <tr>
                        <td>age</td>
                        <td>{{user.age}}</td>
                    </tr>
                     <tr>
                        <td>sex</td>
                        <td>{{user.sex}}</td>
                    </tr>
                     <tr>
                        <td>enroll date</td>
                        <td>2022-04-15</td>
                    </tr>
                </tbody>
            </table>
        </div>  
    </div>
</template>

<script lang="ts">
import { defineComponent } from 'vue'
import { tokenKey,userinfoKey } from "./../../utils/constants";
import { mapState } from "vuex";

export default defineComponent({
    setup() {
        
    },
    name:"HomeIndex",
    computed:{            
        ...mapState({
            user(state:any){     
                if(state && state.user && state.user.user && state.user.user && state.user.user.username){
                    return state.user.user
                }else{                        
                    let user=JSON.parse(window.localStorage.getItem(userinfoKey) || "");
                    if(user && user.username){
                        return user
                    }
                }
                return {}
            }
        })
    }
})
</script>
